<!DOCTYPE html>
<html lang="zh-CN">
  <html>
    <head>
      <meta charset="utf-8" />
      <title>select-tree</title>
      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.4.1/dist/css/bootstrap.min.css" />
      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/ztree@3.5.24/css/metroStyle/metroStyle.css" />
      <script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
      <script src="https://cdn.jsdelivr.net/npm/ztree@3.5.24/js/jquery.ztree.all.js"></script>
      <script>
        $(function() {
          var zNodes = [
            { id: 1, pId: 0, name: "湖南省", open: true, chkDisabled: true },
            { id: 101, pId: 1, name: "长沙", checked: true },
            { id: 102, pId: 1, name: "株洲" },

            { id: 2, pId: 0, name: "湖北省", open: false, chkDisabled: true },
            { id: 201, pId: 2, name: "武汉" },
            { id: 206, pId: 2, name: "黄石" },

            { id: 3, pId: 0, name: "山东省", open: false, chkDisabled: true },
            { id: 301, pId: 3, name: "济南" },
            { id: 302, pId: 3, name: "青岛" }
          ];
          var selectTree = $(".select-tree").selectTree(zNodes, { chkStyle: "radio", chkTyle: "radio", height: 200 });

          $("#getVal").click(function(e) {
            alert(selectTree.getVal());
            e.preventDefault();
          });
        });
      </script>
    </head>

    <body>
      <div class="container">
        <form class="form-horizontal">
          <div class="form-group"></div>
          <div class="form-group">
            <label class="col-sm-2 control-label">测试输入框：</label>
            <div class="col-sm-8 select-tree">
              <input type="text" class="form-control" placeholder="请点击选择" readonly />
              <div class="dropdown-menu">
                <input class="form-control" placeholder="输入搜索" />
                <ul class="ztree"></ul>
              </div>
            </div>
          </div>
          <button class="btn btn-info" id="getVal">获取值</button>
        </form>
      </div>
    </body>
  </html>
</html>
